import React, { useEffect, useState } from 'react';
import { connect } from 'dva';
import { Image, Tag } from 'antd';
import { height } from 'dom-helpers';


const theProps = (state) => {
    return {
        id: state.maps.mapsId,
        fibsemInfo: state.fibsem.fibsemInfo,
        fibsemImg: state.fibsem.fibsemImg
    }
}


function Fibsem(props) {
    const { mapsInfo, dispatch, id, fibsemImg, fibsemInfo } = props;
    console.log('aa', fibsemInfo, fibsemImg);
    const imgUrl = `${fibsemImg}`
    const [viewer, setViewer] = useState(null);
    useEffect(() => {
        dispatch({
            type: 'fibsem/getInfo',
            payload: id
        })
        return () => {
        }
    }, [dispatch, id]);
    useEffect(() => {
        dispatch({
            type: 'fibsem/getfibsemImg',
            payload: id
        })
    })
    return (
        <>
            <div>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">样品编号:{fibsemInfo ? fibsemInfo[0]?.fibSem?.sampleId : ''}</Tag>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">区块:{fibsemInfo ? fibsemInfo[0]?.fibSem?.region : ''}</Tag>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">井区:{fibsemInfo ? fibsemInfo[0]?.fibSem?.wellBlock : ''}</Tag>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">井号:{fibsemInfo ? fibsemInfo[0]?.fibSem?.wellNum : ''}</Tag>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">层次:{fibsemInfo ? fibsemInfo[0]?.fibSem?.wellLayer : ''}</Tag>
                <Tag style={{ fontSize: '15px' }} color="#2db7f5">井深:{fibsemInfo ? fibsemInfo[0]?.fibSem?.wellDeep : ''}</Tag>
            </div>
            <div style={{ height: '30vh', display: 'flex', alignItems: 'center', marginTop: '20vh' }}>
                <div style={{ width: '100%', textAlign: 'center', marginTop: '10vh' }}>

                    {/* <iframe srcDoc=
                        width="100%"
                        height="100%"
                        id="oldCommunityId"
                        position="relative"
                        overflow="auto"
                    /> */}
                    <Image
                        width='50vw'
                        height='70vh'

                        src={'http://10.89.101.39:9000/' + imgUrl}
                       

                    //src='https://img0.baidu.com/it/u=2849667139,1965988921&fm=26&fmt=auto'
                    />


                    {/*<img src='http://112.194.204.86:9000/data/QemScan/3435917b-8d99-457c-b8e1-328fd18cba8a.jpg'/> */}
                </div>
            </div>


        </>
    )
}

export default connect(theProps, null)(Fibsem)
